<html>
    <head>
        <title>Test</title>
        <style>


button.custom {
  appearance: none; // suppress default styling
  border:2px solid;
}

button.custom:hover {
  background:gold;
}

input.custom {
  appearance: none; // suppress default styling
  border:2px solid;
}



        </style>
    </head>
    <body>

<p><code>appearance:none;</code> - suppresses default visual styles. Keeps only styles critical for runtime operation.</p>

<p>Custom button <button.custom>Custom button</button></p>
<p>Custom text input <input|text.custom value="custom"/></p>


    </body>
</html>